<template>
  <div class="page">
    <MNavbar title="订单详情" :back="true" />

    <div class="section">
      <div class="card">
        <div class="card-title">订单信息</div>
        <div class="list">
          <div class="list-item"><div><div class="list-item__label">订单号</div><div class="list-item__desc">—</div></div></div>
          <div class="list-item"><div><div class="list-item__label">下单时间</div><div class="list-item__desc">—</div></div></div>
          <div class="list-item"><div><div class="list-item__label">订单状态</div><div class="list-item__desc">—</div></div></div>
        </div>
      </div>
    </div>

    <div class="section">
      <div class="card">
        <div class="card-title">收货人</div>
        <div class="list">
          <div class="list-item"><div><div class="list-item__label">姓名</div><div class="list-item__desc">—</div></div></div>
          <div class="list-item"><div><div class="list-item__label">电话</div><div class="list-item__desc">—</div></div></div>
          <div class="list-item"><div><div class="list-item__label">地址</div><div class="list-item__desc">—</div></div></div>
        </div>
      </div>
    </div>

    <div class="section">
      <div class="card">
        <div class="card-title">金额</div>
        <div class="list">
          <div class="list-item"><div><div class="list-item__label">商品金额</div><div class="list-item__desc">—</div></div></div>
          <div class="list-item"><div><div class="list-item__label">运费</div><div class="list-item__desc">—</div></div></div>
          <div class="list-item"><div><div class="list-item__label">实付金额</div><div class="list-item__desc">—</div></div></div>
        </div>
      </div>
    </div>

    <div class="section">
      <div class="card">
        <div class="card-title">物流</div>
        <div class="list">
          <div class="list-item"><div><div class="list-item__label">物流公司</div><div class="list-item__desc">—</div></div></div>
          <div class="list-item"><div><div class="list-item__label">运单号</div><div class="list-item__desc">—</div></div></div>
        </div>
      </div>
    </div>

    <div class="section">
      <div class="card" style="display:flex; gap: 12px;">
        <button class="btn">取消订单</button>
        <button class="btn btn-primary">去发货</button>
      </div>
    </div>
  </div>
</template>
<script setup>
import MNavbar from '@/components/MNavbar.vue'
</script>

